import React, { Component } from 'react';
import styles from './index.less';
import { connect } from 'react-redux';
import { NoData } from "../common/noData";
import {actionTypes} from './store'
class TopicWrapper extends Component {
  render() {
    if(this.props.Images && this.props.Images.length != 0){
      return (
        <div className={styles.TopicWrapper}>
          {
            this.props.Images.map((item) => {
              return(
                <a className={styles.topicItem} herf='#' key={item.id} ><img alt='热门图片' src={item.url}/></a>
              )}   
            )
          }
        </div>
      ); 
    }
    return <NoData/>
  }
  componentDidMount(){
    return this.props.getTopic();
  }
};
const mapState = (state) =>{
  return{
    Images:state.home.homeTopicImages,
  }
};
const mapDispatch =(disPatch) =>{
  return{
    getTopic(){
      disPatch(actionTypes.getTopicData())
    }
  }
}
export default connect(mapState,mapDispatch)(TopicWrapper);